<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小兔仙儿~主页</title>

    <meta name="description" content="小兔鲜儿官网，致力于打造全球最大的食品、生鲜电商购物平台。">
    <meta name="keywords" content="小兔鲜儿,食品,生鲜,服装,家电,电商,购物">
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

    <link rel="stylesheet" href="https://at.alicdn.com/t/c/font_3717641_u5360a8j3t.css">
    <link rel="stylesheet" href="css/base.css" />
    <link rel="stylesheet" href="css/common.css" />
    <link rel="stylesheet" href="css/index.css" />
</head>

<body>

    <body>
        <header>
            <!--第一部分，快捷菜单 -->
            <div class="fast-menu">
                <div class="menu container">
                    <a href="#">请先登录</a><span>|</span>
                    <a href="#">免费注册</a><span>|</span>
                    <a href="#">我的订单</a><span>|</span>
                    <a href="#">会员中心</a><span>|</span>
                    <a href="#">帮助中心</a><span>|</span>
                    <a href="#">在线客服</a><span>|</span>
                    <a href="#">
                        手机版
                    </a>
                </div>
            </div>
            <!--第二部分，logo和大导航栏 -->
            <div class="navigation container">
                <!--大导航栏左侧（logo）-->
                <div class="logo">
                    <h1>
                        <a href="#" class="logo-text">小兔鲜儿~</a>
                    </h1>
                    <a href="#" class="logo-img">
                        <img src="./images/logo.png" alt="">
                    </a>
                </div>

                <!--大导航栏右侧-->
                <ul>
                    <li><a href="#">首页</a></li>
                    <li><a href="#">生鲜</a></li>
                    <li><a href="#">美食</a></li>
                    <li><a href="#">餐厨</a></li>
                    <li><a href="#">电器</a></li>
                    <li><a href="#">居家</a></li>
                    <li><a href="#">洗护</a></li>
                    <li><a href="#">孕婴</a></li>
                    <li><a href="#">服装</a></li>
                </ul>
                <div class="search">
                    <span class="iconfont icon-sousuo"></span>
                    <input type="search" placeholder="搜一搜" class="search-input">
                </div>

                <div class="cart">
                    <span class="iconfont icon-gouwuchekong"></span>
                    <span class="number">2</span>
                </div>
            </div>
        </header>

        <!-- 第四部分，大侧边栏与轮播图 -->
        <div class="banner container">
            <div class="slideshow">
                <!-- 背景图片 -->
                <ul class="slideshow-bg">
                    <li>
                        <a href="#">
                            <img src="./uploads/banner_1.png" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./uploads/banner_1.png" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./uploads/banner_1.png" alt="">
                        </a>
                    <li>
                        <a href="#">
                            <img src="./uploads/banner_1.png" alt="">
                        </a>
                    </li>
                </ul>
                <!-- 方向键 -->
                <a class="button-left" href="#">
                    <i class="iconfont icon-xiangzuojiantou"></i>
                </a>
                <a class="button-right" href="#">
                    <i class="iconfont icon-xiangyoujiantou"></i>
                </a>
                <!-- 轮播点 -->
                <div class="slideshow-point">
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                </div>
            </div>

            <!-- 大侧边栏 -->
            <div class="sidebar"">
                <li>
                    <a href=" #"><span>生鲜</span>&nbsp;&nbsp;<span>水果</span>&nbsp;<span>蔬菜</span></a>
                <a href="#"> <i class="iconfont icon-jinrujiantou"></i></a>
                </li>
                <li>
                    <a href="#"><span>主食</span>&nbsp;&nbsp;<span>馒头</span>&nbsp;<span>大饼</span></a>
                    <a href="#"> <i class="iconfont icon-jinrujiantou"></i></a>
                </li>
                <li>
                    <a href="#"><span>数码</span>&nbsp;&nbsp;<span>手机</span>&nbsp;<span>电脑</span></a>
                    <a href="#"> <i class="iconfont icon-jinrujiantou"></i></a>
                </li>
                <li>
                    <a href="#"><span>家电</span>&nbsp;&nbsp;<span>冰箱</span>&nbsp;<span>电视</span></a>
                    <a href="#"> <i class="iconfont icon-jinrujiantou"></i></a>
                </li>
                <li>
                    <a href="#"><span>居家</span>&nbsp;&nbsp;<span>清洁</span>&nbsp;<span>整理</span></a>
                    <a href="#"> <i class="iconfont icon-jinrujiantou"></i></a>
                </li>
                <li>
                    <a href="#"><span>洗护</span>&nbsp;&nbsp;<span>洁面</span>&nbsp;<span>护肤</span></a>
                    <a href="#"> <i class="iconfont icon-jinrujiantou"></i></a>
                </li>
                <li>
                    <a href="#"><span>孕婴</span>&nbsp;&nbsp;<span>奶粉</span>&nbsp;<span>玩具</span></a>
                    <a href="#"> <i class="iconfont icon-jinrujiantou"></i></a>
                </li>
                <li>
                    <a href="#"><span>服饰</span>&nbsp;&nbsp;<span>卫衣</span>&nbsp;<span>仔裤</span></a>
                    <a href="#"> <i class="iconfont icon-jinrujiantou"></i></a>
                </li>
                <li>
                    <a href="#"><span>杂货</span>&nbsp;&nbsp;<span>户外</span>&nbsp;<span>图书</span></a>
                    <a href="#"> <i class="iconfont icon-jinrujiantou"></i></a>
                </li>
                <li>
                    <a href="#"><span>海外</span>&nbsp;&nbsp;<span>潮流</span>&nbsp;<span>大牌</span></a>
                    <a href="#"> <i class="iconfont icon-jinrujiantou"></i></a>
                </li>
            </div>
        </div>

        <!-- 第五部分，商品展示栏1 -->
        <div class="new-popular-goods container">
            <div class="new-header">
                <div class="new-title">
                    <h2>新鲜好物</h2>
                    <h5>新鲜出炉，品质靠谱</h5>
                </div>
                <a href="#" class="more">
                    查看全部
                    <i class="iconfont icon-jinrujiantou"></i>
                </a>
            </div>
            <!-- 新鲜列表 -->
            <ul class="new-list">
                <li>
                    <a href="#">
                        <div class="goods-img">
                            <img src="./uploads/new_goods_1.jpg" alt="">
                        </div>
                        <h3>睿米无线吸尘器F8</h3>
                        <p class="price">
                            <span>¥</span>
                            899
                        </p>
                    </a>
                    <span class="new-text">新品</span>
                </li>
                <li>
                    <a href="#">
                        <div class="goods-img">
                            <img src="./uploads/new_goods_2.jpg" alt="">
                        </div>
                        <h3>智能环绕3D空调</h3>
                        <p class="price">
                            <span>¥</span>
                            1299
                        </p>
                    </a>
                    <span class="new-text">新品</span>
                </li>
                <li>
                    <a href="#">
                        <div class="goods-img">
                            <img src="./uploads/new_goods_3.jpg" alt="">
                        </div>
                        <h3>广东软软糯米煲仔饭</h3>
                        <p class="price">
                            <span>¥</span>
                            129
                        </p>
                    </a>
                    <span class="new-text">新品</span>
                </li>
                <li>
                    <a href="#">
                        <div class="goods-img">
                            <img src="./uploads/new_goods_4.jpg" alt="">
                        </div>
                        <h3>罗西机械智能手表</h3>
                        <p class="price">
                            <span>¥</span>
                            3399
                        </p>
                    </a>
                    <span class="new-text">新品</span>
                </li>
            </ul>
        </div>

        <!-- 第六部分，商品展示栏2 -->
        <div class="new-popular-goods container">
            <div class="popular-header">
                <div class="popular-title">
                    <h2>人气推荐</h2>
                    <h5>人气爆款，不容错过</h5>
                </div>
                <a href="#" class="more">
                    查看全部
                    <i class="iconfont icon-jinrujiantou"></i>
                </a>
            </div>
            <!-- 人气列表 -->
            <ul class="popular-list">
                <li>
                    <a href="#">
                        <div class="goods-img">
                            <img src="./uploads/popular_1.jpg" alt="">
                        </div>
                        <h3>特惠推荐</h3>
                        <p>我猜得到，你的需要</p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <div class="goods-img">
                            <img src="./uploads/popular_2.jpg" alt="">
                        </div>
                        <h3>爆款推荐</h3>
                        <p>智能家具，让你的生活不再单调</p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <div class="goods-img">
                            <img src="./uploads/popular_3.jpg" alt="">
                        </div>
                        <h3>场景使用一站买全</h3>
                        <p>编辑精心整理推荐</p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <div class="goods-img">
                            <img src="./uploads/popular_4.jpg" alt="">
                        </div>
                        <h3>领券中心</h3>
                        <p>发现更多超值优惠券</p>
                    </a>
                </li>
            </ul>
        </div>

        <!-- 第七部分，热门品牌 -->
        <div class="hot-goods ">
            <div class="container">

                <div class="hot-header">
                    <div class="hot-title">
                        <h2>热门品牌</h2>
                        <h5>国际经典，品质保证</h5>
                    </div>
                    <a href="#" class="many1">
                        <i class="iconfont icon-xiangzuojiantou"></i>
                    </a>

                    <a href="#" class="many2">
                        <i class="iconfont icon-xiangyoujiantou"></i>
                    </a>
                </div>
                <!-- 爆款列表 -->
                <ul class="hot-list">
                    <li>
                        <a href="#">
                            <div class="goods-img">
                                <img src="./uploads/brand_goods_1.jpg" alt="">
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="goods-img">
                                <img src="./uploads/brand_goods_2.jpg" alt="">
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="goods-img">
                                <img src="./uploads/brand_goods_3.jpg" alt="">
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="goods-img">
                                <img src="./uploads/brand_goods_4.jpg" alt="">
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="goods-img">
                                <img src="./uploads/brand_goods_5.jpg" alt="">
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>

        <!-- 第八部分，生鲜专栏 -->
        <div class="fresh-goods container">
            <div class="fresh-header">
                <h2>生鲜</h2>
                <div class="right">
                    <ul class="tabs">
                        <li><a href="#" class="active">水果</a></li>
                        <li><a href="#">蔬菜</a></li>
                        <li><a href="#">肉类</a></li>
                        <li><a href="#">主食</a></li>
                        <li><a href="#">零食</a></li>
                        <li><a href="#">饮料</a></li>
                        <li><a href="#">干果</a></li>
                    </ul>
                    <a href="#" class="more">查看全部 <i class="iconfont icon-jinrujiantou"></i></a>
                </div>
            </div>
            <!-- 生鲜列表 -->
            <div class="fresh-list">
                <div class="big-pic">
                    <img src="./uploads/fresh_goods_cover.png" alt="">
                </div>
                <ul class="goods-list">
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/fresh_goods_1.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>美威 智利原味三文鱼排 240g/袋 4片装</h3>
                                <p class="type">海鲜年货</p>
                                <p class="price"><span>¥</span> 59</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/fresh_goods_2.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>红功夫 麻辣小龙虾1.5kg 4-6钱/25-32只</h3>
                                <p class="type">火锅食材</p>
                                <p class="price"><span>¥</span> 79</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/fresh_goods_3.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>三都港 冷冻无公害黄花鱼 700g 2条 袋装</h3>
                                <p class="type">海鲜水产</p>
                                <p class="price"><span>¥</span> 49</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/fresh_goods_4.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>渔公码头 大连鲜食入味 即食海参 辽参刺参</h3>
                                <p class="type">调味海</p>
                                <p class="price"><span>¥</span> 899</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/fresh_goods_5.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>越南白心火龙果4个装 标准果400-550g</h3>
                                <p class="type">新鲜水果</p>
                                <p class="price"><span>¥</span> 20</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/fresh_goods_6.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>广西沃柑 新鲜水果 柑橘1.5kg </h3>
                                <p class="type">新鲜水果</p>
                                <p class="price"><span>¥</span> 10</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/fresh_goods_7.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>进口 牛油果 6个装 单果重约130-180g</h3>
                                <p class="type">新鲜水果</p>
                                <p class="price"><span>¥</span> 50</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/fresh_goods_8.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>泰国进口山竹5A级 500g</h3>
                                <p class="type">新鲜水果</p>
                                <p class="price"><span>¥</span> 60</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>

        <!-- 第九部分，服饰专栏 -->
        <div class="clothes-goods container">
            <div class="clothes-header">
                <h2>服饰</h2>
                <div class="right">
                    <ul class="tabs">
                        <li><a href="#" class="active">外套</a></li>
                        <li><a href="#">卫衣</a></li>
                        <li><a href="#">围巾</a></li>
                        <li><a href="#">裤装</a></li>
                        <li><a href="#">衬衫</a></li>
                        <li><a href="#">T恤</a></li>
                        <li><a href="#">内衣</a></li>
                    </ul>
                    <a href="#" class="more">查看全部 <i class="iconfont icon-jinrujiantou"></i></a>
                </div>
            </div>
            <!-- 服饰列表 -->
            <div class="clothes-list">
                <div class="big-pic">
                    <img src="./uploads/clothes_goods_cover.jpg" alt="">
                </div>
                <ul class="goods-list">
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/clothes_goods_1.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>匡威 时尚运动板鞋 舒适得体 简约大方</h3>
                                <p class="type">潮流运动</p>
                                <p class="price"><span>¥</span> 59</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/clothes_goods_2.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>Apple 智能手表 炫彩表带 经久耐用</h3>
                                <p class="type">智能配件</p>
                                <p class="price"><span>¥</span> 79</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/clothes_goods_3.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>古驰 都市丽人 红色至上主义 女士挂包</h3>
                                <p class="type">国际品牌</p>
                                <p class="price"><span>¥</span> 49</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/clothes_goods_4.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>田园印象 小麦青色连衣长裙 XL小尺码现货</h3>
                                <p class="type">简约出行</p>
                                <p class="price"><span>¥</span> 899</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/clothes_goods_5.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>花花公子 商务男性POLO衫 纯白色全尺码</h3>
                                <p class="type">男士专栏</p>
                                <p class="price"><span>¥</span> 20</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/clothes_goods_6.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>特步 轻盈科技运动跑鞋 星环紫 现货发售</h3>
                                <p class="type">强体健身</p>
                                <p class="price"><span>¥</span> 10</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/clothes_goods_7.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>足力健 老人鞋 防滑不磨脚 走路不累</h3>
                                <p class="type">老年专栏</p>
                                <p class="price"><span>¥</span> 50</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/clothes_goods_8.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>男士纯棉背心 藏青色 选用100%新疆棉</h3>
                                <p class="type">内衣内裤</p>
                                <p class="price"><span>¥</span> 60</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>

        <!-- 第十部分，清洁专栏 -->
        <div class="clean-goods container">
            <div class="clean-header">
                <h2>清洁</h2>
                <div class="right">
                    <ul class="tabs">
                        <li><a href="#" class="active">护理</a></li>
                        <li><a href="#">洗衣</a></li>
                        <li><a href="#">洗漱</a></li>
                        <li><a href="#">洁厕</a></li>
                        <li><a href="#">纸类</a></li>
                        <li><a href="#">用具</a></li>
                        <li><a href="#">其他</a></li>
                    </ul>
                    <a href="#" class="more">查看全部 <i class="iconfont icon-jinrujiantou"></i></a>
                </div>
            </div>
            <!-- 清洁列表 -->
            <div class="clean-list">
                <div class="big-pic">
                    <img src="./uploads/kitchen_goods_cover.jpg" alt="">
                </div>
                <ul class="goods-list">
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/kitchen_goods_1.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>304不锈钢 全金属不锈钢餐具 套装</h3>
                                <p class="type">干净卫生</p>
                                <p class="price"><span>¥</span> 59</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/kitchen_goods_2.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>高露洁 炫彩牙刷 量贩装 16支</h3>
                                <p class="type">牙齿健康</p>
                                <p class="price"><span>¥</span> 79</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/kitchen_goods_3.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>工厂直营 可拆洗拖把 便于更换2支装</h3>
                                <p class="type">国际品牌</p>
                                <p class="price"><span>¥</span> 49</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/kitchen_goods_4.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>白猫 家用洗洁精 好用不伤手 3瓶装</h3>
                                <p class="type">一扫油污</p>
                                <p class="price"><span>¥</span> 899</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/kitchen_goods_5.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>金纺 5L大瓶洗衣液 薰衣草香</h3>
                                <p class="type">清新怡人</p>
                                <p class="price"><span>¥</span> 20</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/kitchen_goods_6.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>洁成 绵柔抹布 超强吸水 强力去污</h3>
                                <p class="type">一抹即净</p>
                                <p class="price"><span>¥</span> 10</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/kitchen_goods_7.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>大卫 拖把专家 贵一点更好用</h3>
                                <p class="type">一年质保</p>
                                <p class="price"><span>¥</span> 50</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/kitchen_goods_8.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>威露士 衣物保护液 持久杀菌 香气留存</h3>
                                <p class="type">主播推荐</p>
                                <p class="price"><span>¥</span> 60</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝></p>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>

        <!-- 第十一部分，居家专栏 -->
        <div class="home-goods container">
            <div class="home-header">
                <h2>居家</h2>
                <div class="right">
                    <ul class="tabs">
                        <li><a href="#" class="active">花草</a></li>
                        <li><a href="#">家具</a></li>
                        <li><a href="#">水壶</a></li>
                        <li><a href="#">床具</a></li>
                        <li><a href="#">烘焙</a></li>
                        <li><a href="#">香氛</a></li>
                        <li><a href="#">储物</a></li>
                    </ul>
                    <a href="#" class="more">查看全部 <i class="iconfont icon-jinrujiantou"></i></a>
                </div>
            </div>
            <!-- 居家列表 -->
            <div class="home-list">
                <div class="big-pic">
                    <img src="./uploads/home_goods_cover.jpg" alt="">
                </div>
                <ul class="goods-list">
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/home_goods_1.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>欧派 家用抽油烟机 简约型</h3>
                                <p class="type">置换补贴</p>
                                <p class="price"><span>¥</span> 59</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/home_goods_2.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>中华 离子交换树脂再生剂 3包</h3>
                                <p class="type">吸附异味</p>
                                <p class="price"><span>¥</span> 79</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/home_goods_3.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>欧阳 家用水果榨汁机 小功率</h3>
                                <p class="type">动手乐趣</p>
                                <p class="price"><span>¥</span> 49</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/home_goods_4.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>九阳 热水壶 煮茶温药一体机</h3>
                                <p class="type">功能多样</p>
                                <p class="price"><span>¥</span> 899</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/home_goods_5.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>小小仙人球 电脑防辐射</h3>
                                <p class="type">舒适养眼</p>
                                <p class="price"><span>¥</span> 20</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/home_goods_6.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>半球 大个保温杯 小熊印花 1L容量</h3>
                                <p class="type">补充水分</p>
                                <p class="price"><span>¥</span> 10</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/home_goods_7.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>家用茶盘 高强度不易碎 换新免费</h3>
                                <p class="type">结实耐用</p>
                                <p class="price"><span>¥</span> 50</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝 ></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/home_goods_8.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>被褥枕头 中式古典围帐</h3>
                                <p class="type">温暖舒适</p>
                                <p class="price"><span>¥</span> 60</p>
                            </div>
                            <!-- 找相似 -->
                            <div class="find">
                                <p>找相似</p>
                                <p>发现更多宝贝></p>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>

        <!-- 第十二部分，最新专题 -->
        <div class="new-topic">
            <div class="container">
                <div class="topic-header">
                    <div class="topic-title">
                        <h2>新鲜好物</h2>
                    </div>
                    <a href="#" class="more">查看全部 <i class="iconfont icon-jinrujiantou"></i></a>
                </div>
                <ul class="topic-list">
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/topic_goods_1.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>吃这些美食才不算辜负自己</h3>
                                <p>餐厨起居洗护好物</p>
                            </div>
                            <div class="price"><span>¥</span> 29.9起</div>
                        </a>
                        <div class="social">
                            <span class="like"> 1220</span>
                            <span class="view"> 1800</span>
                            <span class="reply"> 246</span>
                        </div>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/topic_goods_2.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>吃这些美食才不算辜负自己</h3>
                                <p>餐厨起居洗护好物</p>
                            </div>
                            <div class="price"><span>¥</span> 29.9起</div>
                        </a>
                        <div class="social">
                            <span class="like"> 1220</span>
                            <span class="view"> 1800</span>
                            <span class="reply"> 246</span>
                        </div>
                    </li>
                    <li>
                        <a href="#">
                            <div class="img-box">
                                <img src="./uploads/topic_goods_3.jpg" alt="">
                            </div>
                            <div class="info">
                                <h3>吃这些美食才不算辜负自己</h3>
                                <p>餐厨起居洗护好物</p>
                            </div>
                            <div class="price"><span>¥</span> 29.9起</div>
                        </a>
                        <div class="social">
                            <span class="like"> 1220</span>
                            <span class="view"> 1800</span>
                            <span class="reply"> 246</span>
                        </div>
                    </li>
                </ul>
            </div>
        </div>


        <footer>
            <!-- 第三部分，服务，关注与下载 -->
            <div class="support container">
                <div class="user-service">
                    <h6>客户服务</h6>
                    <ul>
                        <li>
                            <i class="iconfont icon-kefu01"> </i>
                            <span>
                                在线客服
                            </span>
                        </li>
                        <li>
                            <i class="iconfont icon-changjianwentixiangguanwenti"></i>
                            <span>
                                问题反馈
                            </span>
                        </li>
                    </ul>
                </div>

                <div class="contact-us">
                    <h6>关注我们</h6>
                    <ul>
                        <li>
                            <i class="iconfont icon-gongzhonghao" style="color: green;"></i>
                            <span>公众号</span>
                        </li>
                        <li>
                            <i class="iconfont icon-weibo"></i>
                            <span>微博</span>
                        </li>
                    </ul>
                </div>

                <div class="download-app">
                    <h6>下载App</h6>
                    <ul>
                        <li>
                            <img src="./uploads/qrcode.png" alt="">
                        </li>
                        <li>
                            <p>扫描二维码</p>
                            <p>立马下载App</p>
                            <a href="#">下载页面</a>
                        </li>
                    </ul>
                </div>

                <div class="line"></div><!-- 分割线 -->

                <div class="service-phone ">
                    <h6>服务热线</h6>
                    <div>
                        <p>400-888-8888</p>
                        <p>周一至周日 8:00-18:00</p>
                    </div>
                </div>
            </div>

            <!-- 第四部分，承诺，版权与友情链接 -->
            <div class="promise">
                <div class="ours-promise container">
                    <div>
                        <span></span>
                        <span>价格亲民</span>
                    </div>
                    <div>
                        <span></span>
                        <span>物流快捷</span>
                    </div>
                    <div>
                        <span></span>
                        <span>品质新鲜</span>
                    </div>
                </div>
            </div>
            <!-- 版权 -->
            <div class="copyright">
                <p>
                    <a href="#">关于我们</a> <span>|</span>
                    <a href="#">帮助中心</a> <span>|</span>
                    <a href="#">售后服务</a> <span>|</span>
                    <a href="#">配送与验收</a> <span>|</span>
                    <a href="#">商务合作</a> <span>|</span>
                    <a href="#">搜索推荐</a> <span>|</span>
                    <a href="#">友情链接</a>
                </p>
                <p>CopyRight @ 小兔鲜儿</p>
            </div>

        </footer>

    </body>

</html>